import React, { memo } from "react";
import { Route, Link, useHistory } from "react-router-dom";
import { CollectArticleWrapper } from "./style";
import { getArticleDetail } from "@/service/index";
import { FAV_CATEGORY_ID } from "@/common/contants";
import { Empty } from "antd";
export default memo(function CollectArticle(props) {
  const { articleFavs } = props;
  const history = useHistory();
  console.log(articleFavs);
  //   const itemClick = async (id) => {
  //     history.push(`/articleDetail?id=${id}&categoryId=${FAV_CATEGORY_ID}`);
  //   };
  return (
    <CollectArticleWrapper>
      <div className="content">
        {articleFavs&&articleFavs.length > 0 ? (
          articleFavs.map((item, index) => {
            return (
              <Link
                key={item.id}
                className="fav-item"
                to={`/articleDetail?id=${item.newsId}&categoryId=${FAV_CATEGORY_ID}`}
                target="_blank"
              >
                <div className="fav-title">
                  <div className="title">{item.title}</div>
                </div>
                <div className="fav-pic">
                  <img src={item.pic} alt="" />
                </div>
              </Link>
            );
          })
        ) : (
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
        )}
      </div>
    </CollectArticleWrapper>
  );
});
